* {
  margin: 0;
  padding: 0;
}

html,
body {
  width: 100%;
  height: 100%;
  background: #f7f8fe;
}

.box {
  width: 100vw;
  height: 1.173333rem;
  background: #f7f8fe;
  display: flex;
  justify-content: space-around;
  align-items: center;

}

.content {
  overflow-y: scroll;
  height: calc(100vh - 1.173333rem - 1.28rem);
}

.img1 {
  width: 7.253333rem;
  height: 1.173333rem;
}

.btn1 {
  width: .906667rem;
  height: .426667rem;
  background: #79ddc1;
  border: .026667rem solid #58aea1;
  border-radius: .266667rem;
  font-size: 12px;
  text-align: center;
  line-height: .426667rem;

}

.btn2 {
  width: .693333rem;
  height: .586667rem;
  background: #8549ff;
  border-radius: .533333rem;
  border: none;
  font-size: 12px;
  color: white;
}

.box1 {
  width: 100vw;
  height: 1.44rem;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin-top: .426667rem;
  margin-bottom: .64rem;
}

.box1-1 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.box1-2 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.box1-3 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.box1-4 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.box1-5 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.img2 {
  width: .853333rem;
  height: .793333rem;
}

.img3 {
  width: .853333rem;
  height: .793333rem;
}

.img4 {
  width: .853333rem;
  height: .793333rem;
}

.img5 {
  width: .853333rem;
  height: .793333rem;
}

.img6 {
  width: .853333rem;
  height: .793333rem;
}

.span1,
.span2,
.span3,
.span4,
.span5 {
  font-size: 12px;
}

.box2 {
  width: 100vw;
  height: 4.586667rem;
  background: white;
}

.box2-0 {
  display: flex;
  justify-content: space-around;
  margin-bottom: .373333rem;
  margin-top: .133333rem;
}

.box2-1,
.box2-2,
.box2-3,
.box2-4,
.box2-5,
.box2-6,
.box2-7,
.box2-8,
.box2-9,
.box2-10 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.img7,
.img8,
.img9,
.img10,
.img11,
.img12,
.img13,
.img14,
.img15,
.img16 {
  width: 1.173333rem;
  height: 1.173333rem;
}

.box2_1 {
  display: flex;
  justify-content: space-around;
}

.span6,
.span7,
.span8,
.span9,
.span10,
.span11,
.span12,
.span13,
.span14,
.span15 {
  font-size: 12px;
}

.box3 {
  width: 100vw;
  height: 4.906667rem;
  background: white;
}

.box3-0 {
  display: flex;
  justify-content: center;
  margin-bottom: .106667rem;
}

.box3-1 {
  display: flex;
  justify-content: center;
}

.box4 {
  width: 100vw;
  height: 2.24rem;
  background: white;
  display: flex;
  align-items: center;
  justify-content: space-around;
  margin-top: .133333rem;
}

.box4-1,
.box4-2,
.box4-3,
.box4-4,
.box4-5 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.img20,
.img21,
.img22,
.img23,
.img24 {
  width: .96rem;
  height: .96rem;
}

.span16,
.span17,
.span18,
.span19,
.span20 {
  font-size: 12px;
}

.box5 {
  width: 100vw;
  height: 1.226667rem;
  background: white;
  margin-top: .133333rem;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

a {
  text-decoration: none;
  color: #979797;
  font-size: 16px;
}
.ab{
  font-weight: bold;
  color: #000000;
}
.ab:hover .span21 {
  color: #8448ff;
}

.ab:hover .span22 {
  color: #8448ff;
}

.ab:hover .span23 {
  color: #8448ff;
}

.ab:hover .span24 {
  color: #8448ff;
}

.ab:hover .span25 {
  color: #8448ff;
}

.ab:hover .span26 {
  color: #8448ff;
}

.box6 {
  width: 100vw;
  background: white;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  align-items: center;
}

.navbar {
  width: 100vw;
  height: 1.2rem;
  background: white;
  /* display: flex; */
  position: fixed;
  justify-content: space-around;
  align-items: center;
}

.navbar div:nth-of-type(2){
  width: 3.573333rem;
  height: .133333rem;
  border-radius: .133333rem;
  background: #000000;
  margin: .666667rem auto .213333rem auto;
}


.a3 {
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
}


.img27,
.img28,
.img29,
.img30,
.img31 {
  /* width: .853333rem;
        height: .853333rem; */
}

.footer{
  width: 100%;
  height: 1.2rem;
  position: fixed;
  bottom: 0;
  background: white;
}
.ymdh{
  width: 100%;
  height: 1.2rem;
  display: flex;
  justify-content: space-around;
}
.ymdh div{
  font-size: 10px;
  display: flex;
  flex-direction: column;
  text-align: center;
}
#home_n span{
  color:#8549FF;
}
#yanxuan span{
  color: #F469FD;
}
.ymdh>div:nth-of-type(1) img{
  width: 1.226667rem;
  height: 1.2rem;
}
.ymdh div>img{
  width: .746667rem;
  height: .746667rem;
}

.ymdh .rmb img{
  width: 1.226667rem;
  height: 1.226667rem;
}

/* .span27 {
  font-size: 10px;
  color: #b794ff;
}

.span28 {
  font-size: 10px;
  color: #f9a8fe;
}

.span29 {
  font-size: 10px;
}

.span30 {
  font-size: 10px;
} */
/* dj */
.dj{
  display: flex;
  width: 5.893333rem;
  height: 1.68rem;
  background:url('../image/ic_kuan.png') no-repeat;
  background-size:5.89rem 1.68rem;
  position: fixed;
  bottom: 2.6rem;
  left: 2.133333rem;
  justify-content: space-around;

}
.dj>div{
  display: flex;
  flex-direction: column;
  text-align: center;
  margin: auto .16rem;
  font-size: 10px;
  color: #858585;
}
.dj>div>img{
  width: .746667rem;
  height: .56rem;
}
.dj>div:nth-of-type(1)>img{
  width: .746667rem;
  height: .8rem;
}
.a{
  display: none;
}